<!-- 批发寄售订单列表-待发货 -->
<template>
  <div class="purchasing-purchase-consignment-subdeliver">
    <el-container class="subdeliver-box">
      <div
        class="containerdiv"
        v-show='deliveryDetailListx.length===0&&!Uploadhiddendisplay' >暂无数据</div>
      <!-- 上传 -->
      <div
        class="wholesale-batchadd"
        v-show="Uploadhiddendisplay">
        <el-upload
          class="upload-demo"
          action="string"
          :show-file-list="false"
          :auto-upload="true"
          :http-request="handleUpload"
        >
          <el-button
            size="small"
            type="primary">点击上传</el-button>
          <div
            slot="tip"
            class="el-upload__tip">只能上传excel文件，且不超过10MB</div>
        </el-upload>
      </div>
      <!-- 二维表格  -->
      <div
        class="subdeliver"
        v-if="activeIndex===1">
        <div
          v-for="(item,index) in deliveryDetailListx"
          :key="index">
          <RecordInfo
            :record-form="deliveryheadercolumns"
            :record-data="deliveryDetailListx[0]" />
          <RecordZoomCard
            :card-data="item.pageBean.content"
            :card-columns="cardConfirmedColumns"
            :card-son-columns="cardSonConfirmedColumns"
            :show-list="true"
            :row-title="rowTitle"
            :consignmentstatuss="1"
            @slotboxdeletes="slotBoxDeletes"
            @slotboxconfirmshipment="slotBoxConfirmShipment"
            :base-info='baseInfo[index]'
          >
            <template v-slot:baseInfo="slotProp">
              <span>
                发货产品总数:
                <span class="solt-baseInfo-color">{{ slotProp.baseInfo.deliveryProdSum }}</span>
              </span>
              <span>
                品种数:
                <span class="solt-baseInfo-color">{{ slotProp.baseInfo.prodTypeCount }}</span>
              </span>
              <span>
                总金额:
                <span class="solt-baseInfo-color">{{ getFormatterPrice(slotProp.baseInfo.deliveryTotalAmount) }}</span>
              </span>
            </template>
          </RecordZoomCard>
          <el-pagination
            class="pagination"
            @size-change="reciveHandleSizeChange($event,index)"
            @current-change="reciveHandleCurrentChange($event,index)"
            :current-page="pageList[index].curPage"
            :page-sizes="pageList[index].PAGE_NUMBER"
            :page-size='pageList[index].pageSize'
            :layout="pageList[index].PAGINATION_LAYOUT"
            :total="item.pageBean.totalElements"
          />
        </div>
      </div>
    </el-container>
  </div>
</template>

<script>
import RecordZoomCard from '@/moduleComponents/beforeSettle/distributorSide/purchasingManagement/accompaniedbygoods'
import RecordInfo from '@/moduleComponents/common/detail/recordInfo'
import { PAGE_NUMBER, PAGINATION_LAYOUT } from '@const/common'
import paginationMixin from '@mixins/paginationMixin'
import ElEditable from '@components/el-editable'
import {
  deliveryDetailList,
  deliverygetSaleOrderDeliveryDetail,
  deliveryconsignmentimportdelivery,
  deliveryconfirmSaleOrderDelivery,
  deliverydeleteSaleOrderDelivery,
  deliveryupdateSaleOrderStatusOne,
  deliverygetImportDeliveryTemplate,
  deliveryOcBsNeedSalegetDetail
} from '@const/beforeSettleApi'
import { formatDate, getFormatterPrice } from '@const/filter.js'
import {
  orderheadercolumns,
  orderreleasecolumns,
  receivingGoodsDetail,
  deliveryheadercolumns,
  releasecolumns,
  cardSonConfirmedColumns,
  cardConfirmedColumns
} from './const'
import { hasIn } from 'lodash'
export default {
  mixins: [paginationMixin],
  data () {
    return {
      dialogDefaultUrl: {
        url: ``,
        method: '',
        params: {}
      },
      // 上传显示隐藏状态
      Uploadhiddendisplay: false,
      cardSonConfirmedColumns,
      cardConfirmedColumns,
      releasecolumns,
      activeIndex: 1,
      flowOrderDialog: false,
      orderheadercolumns,
      deliveryheadercolumns,
      orderreleasecolumns,
      receivingGoodsDetail,
      page: {
        PAGE_NUMBER,
        PAGINATION_LAYOUT
      },
      dialogPopupVisible: false,
      productsCtrLens: 3,
      topData: {},
      totalElements: 0,
      deliveryDetailListx: [],
      pageList: [],
      rowTitle: 'bsDeliveryDistributorVOList',
      baseInfo: []
    }
  },
  components: {
    RecordZoomCard,
    RecordInfo,
    ElEditable
  },
  computed: {
    id () {
      return this.$route.query.id
    },
    purchasStatus () {
      return this.$route.query.purchaseOrderStatus
    }
  },
  mounted () {
    this._initGlobalBtn()
    this.getDeliveryDetailList()
  },
  methods: {
    getFormatterPrice,
    deliverySixPageList (ind) {
      this.$axios({
        method: 'post',
        url: deliveryOcBsNeedSalegetDetail,
        data: {
          needOrderId: this.$route.query.id,
          orderStatus: 9,
          deliveryId: this.deliveryDetailListx[ind].deliveryId,
          page: this.pageList[ind].curPage, // 当前页
          pageSize: this.pageList[ind].pageSize
        }
      }).then(res => {
        let content = hasIn(res, 'data.payload.content')
          ? res.data.payload.content
          : []
        this.deliveryDetailListx[ind].pageBean.content = content
      })
    },
    // 页码更改
    reciveHandleSizeChange ($event, index) {
      this.pageList[index].pageSize = $event
      this.deliverySixPageList(index)
    },
    // 切换不一样的页面,重置一切数据
    reciveHandleCurrentChange ($event, index) {
      this.pageList[index].curPage = $event
      this.deliverySixPageList(index)
    },
    _initGlobalBtn () {
      let obj = {}
      if (arguments[0]) {
        obj = {
          type: 'btn',
          arr: [
            {
              type: 'button',
              noReturn: true,
              val: '返回',
              handle: this.globalCancel
            },
            { type: 'primary', val: '撤销', handle: this.globalSubmit },
            { type: 'text', val: '产品导入模板', handle: this.handleImportCode }
          ]
        }
        this.$store.commit('changeLayoutHandle', obj)
        return
      }
      if (this.productsCtrLens > 0) {
        obj = {
          type: 'btn',
          arr: [
            {
              type: 'button',
              noReturn: true,
              val: '返回',
              handle: this.globalCancel
            },
            { type: 'primary', val: '撤销', handle: this.globalSubmit },
            {
              type: 'primary',
              val: '导入收货明细',
              handle: this.shipmentDetails
            },
            { type: 'text', val: '产品导入模板', handle: this.handleImportCode }
          ]
        }
      }
      this.$store.commit('changeLayoutHandle', obj)
    },
    handleImportCode () {
      this.$axios({
        method: 'get',
        url: deliverygetImportDeliveryTemplate
      }).then(res => {
        if (res.data.payload) window.open(res.data.payload)
      })
    },
    // 公用方法
    sharingMethod (id, Status) {
      this.$axios({
        method: 'post',
        url: deliveryupdateSaleOrderStatusOne,
        headers: { 'Content-Type': 'application/json;charset=utf-8' },
        data: {
          id: id,
          purchaseOrderStatus: Status
        }
      }).then(res => {
        this.$router.push({
          path:
            '/distributorSide/purchasingManagement/purchaseOrderTracking/consignmentPurchaseOrder'
        })
      })
    },
    globalCancel () {
      this.$router.go(-1)
    },
    globalSubmit () {
      this.$confirm('确定撤销您当前的修改么？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.sharingMethod(this.deliveryDetailListx[0].saleOrderId, 7)
      })
    },
    shipmentDetails () {
      this.Uploadhiddendisplay = true
    },
    changeDialogShow () {
      this.flowOrderDialog = !this.flowOrderDialog
    },
    handleUpload (data) {
      // 发起上传请求
      let fd = new FormData()
      fd.append('bsSaleOrderId', this.id)
      fd.append('importFile', data.file)
      this.$axios({
        method: 'post',
        url: deliveryconsignmentimportdelivery,
        headers: { 'Content-Type': 'multipart/form-data' },
        data: fd
      })
        .then(res => {
          const { code, payload, msg } = res.data
          if (!Number(code)) {
            this.$message.success('上传成功')
            this.$emit('submitReady', res)
            this.getDeliveryDetailList()
            this.Uploadhiddendisplay = false
          } else {
            this.$message.error(msg)
          }
        })
        .catch(() => {
          // this.$message.error('文件上传失败，请重新选择')
        })
        .finally(() => {
          this.isLoading = false
        })
    },
    // 传递的确认发货
    slotBoxConfirmShipment () {
      this.$axios({
        method: 'post',
        url: deliveryconfirmSaleOrderDelivery,
        headers: { 'Content-Type': 'application/json;charset=utf-8' },
        data: {
          id: this.deliveryDetailListx[0].saleOrderId
        }
      }).then(res => {
        this.$router.push({
          path:
            '/distributorSide/purchasingManagement/purchaseOrderTracking/consignmentPurchaseOrder'
        })
      })
    },
    // 传递的删除
    slotBoxDeletes () {
      this.$axios({
        method: 'post',
        url: deliverydeleteSaleOrderDelivery,
        headers: { 'Content-Type': 'application/json;charset=utf-8' },
        data: {
          deliveryId: this.deliveryDetailListx[0].deliveryId
        }
      }).then(res => {
        this.$router.push({
          path:
            '/distributorSide/purchasingManagement/purchaseOrderTracking/consignmentPurchaseOrder'
        })
      })
    },
    getDeliveryDetailList () {
      this.partDetailTableLoading = true
      this.insideTableLoading = true
      // type 标识订单来源，1.批发2.寄售3.跟台
      this.$axios({
        method: 'post',
        url: deliverygetSaleOrderDeliveryDetail,
        headers: { 'Content-Type': 'application/json;charset=utf-8' },
        data: {
          id: this.id,
          orderStatus: 2,
          page: 1,
          pageSize: 20
        }
      })
        .then(({ data }) => {
          if (Number(data.code) !== 0) return
          this.deliveryDetailListx = data.payload

          if (this.deliveryDetailListx.length) this._initGlobalBtn()
          this.baseInfo = this.deliveryDetailListx.map(item => {
            return {
              deliveryProdSum: item.deliveryProdSum,
              prodTypeCount: item.prodTypeCount,
              deliveryTotalAmount: item.deliveryTotalAmount
            }
          })
          this.pageList = this.deliveryDetailListx.map(item => {
            return {
              curPage: 1, // 当前页
              PAGE_NUMBER, // 页码数组
              PAGINATION_LAYOUT, // 页码功能布局
              pageSize: PAGE_NUMBER[0] // 一页的数量
            }
          })
        })
        .catch(e => {})
        .finally(() => {
          this.partDetailTableLoading = false
          this.insideTableLoading = false
        })
    }
  }
}
</script>
<style lang="less">
@import '../m-front-common/pc/assets/var.less';
.purchasing-purchase-consignment-subdeliver {
  height: 100%;
  display: flex;
  flex-direction: column;
  .subdeliver-box {
    flex-direction: column;

    .el-form-item__label {
      width: 110px !important;
    }

    .pagination {
      padding-top: 10px;
      display: flex;
      justify-content: flex-end;
      padding-right: 0;
    }
  }
  .header-limit {
    .el-input__inner {
      width: 200px;
    }
    .el-date-editor {
      width: 368px;
    }
  }
  .slotbox {
    button {
      float: right;
      margin-left: 3px;
    }
  }
  .containerdiv {
    text-align: center;
  }
}
</style>
